import React from "react";
import { connect } from "react-redux";
import { removeAction } from "./store/actionCreator";

const mapStateToProps = (state) => {
  return {
    list: state.list,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    remove(id) {
      dispatch(removeAction(id));
    },
  };
};

const List = connect(
  mapStateToProps,
  mapDispatchToProps
)((props) => {
  return (
    <ul>
      {props.list.map((item) => (
        <li key={item._id}>
          {item.title} -{" "}
          <button onClick={() => props.remove(item._id)}>删除</button>
        </li>
      ))}
    </ul>
  );
});

// export default connect(mapStateToProps, mapDispatchToProps)(List);
export default List;
